<template>
  <van-popup position="right" :value="editShow">
    <!-- 顶部 -->
    <van-nav-bar
      left-arrow
      title="用户资料"
      @click-left="$emit('update:editShow', false)"
    >
    </van-nav-bar>
    <!-- 头像 -->
    <van-cell title="头像" style="line-height: 40px; padding-right: 10px">
      <template #right-icon>
        <div class="userPhoto"><img src="@/assets/candy.jpg" alt="" /></div>
        <i class="iconfont iconicon_more"></i>
      </template>
    </van-cell>
    <!-- 菜单列表 -->
    <div class="card">
      <van-cell title="昵称" is-link value="续命咖啡" />
      <van-cell title="性别" is-link value="男" />
      <van-cell title="地区" is-link value="北京市" />
      <van-cell title="个人简介" is-link value="有点懒，什么都没有写" />
    </div>
  </van-popup>
</template>
<script>
export default {
  name: 'UserInfo',
  props: ['editShow'],

  data () {
    return {
      showEdit: false,
      inputValue: ''
    }
  },
  methods: {}
}
</script>
<style lang="less" scoped>
.van-popup {
  height: 100%;
  width: 100%;
  background-color: #f9f9f9;
  .van-cell {
    width: 690px;
    height: 120px;
    background: #ffffff;
    border-radius: 16px;
    font-size: 30px;
    color: #181a39;
    margin: 36px auto 0;
    .userPhoto img {
      width: 80px;
      height: 80px;
      border-radius: 50%;
      text-align: right;
      overflow: hidden;
    }
  }
}
.iconicon_more {
  padding: 0 20px;
}
.card {
  width: 690px;
  height: 440px;
  background: #ffffff;
  border-radius: 16px;
  margin: 0 auto;
}
::v-deep .van-nav-bar__content {
  background-color: #fff;
}
</style>
